<template>
  <div id="theme-layout">
    <!-- Start Header -->
    <header id="header" class="header-large">
      <div class="container">
        <div class="show-mobile-menu clearfix">
          <a href="#mobile-menu" class="mobile-menu-icon">
            <span /><span /><span /><span />
          </a>
        </div>
        <div class="row header">
          <div class="col-md-3">
            <div class="tw-logo">
              <a class="logo" href="index.html"><img class="logo-img" :src="require('@/assets/web-site/upload/logo.png')" alt="Craft"></a>
            </div>
          </div>
          <div class="col-md-9">
            <nav class="menu-container clearfix">
              <div class="tw-menu-container">
                <ul id="menu" class="sf-menu">
                  <li class="menu-item menu-item-has-children"><a href="index.html">Home</a></li>
                  <li class="menu-item menu-item-has-children"><a href="about.html">About Us</a></li>
                  <li class="menu-item menu-item-has-children"><a href="portfolio.html">Portfolio</a></li>
                  <li class="menu-item menu-item-has-children"><a href="blog.html">Blog</a></li>
                  <li class="menu-item menu-item-has-children"><a href="shop.html">Shop</a></li>
                  <li class="menu-item menu-item-has-children"><a href="contact.html">Contact</a></li>
                </ul>
              </div>
            </nav>
          </div>
        </div>
      </div>
    </header>
    <div class="header-clone" />
    <!-- End Header -->

    <section id="slider">

      <div class="ls-wp-fullwidth-container" style="height:805px;">
        <div class="ls-wp-fullwidth-helper">
          <div id="layerslider_1_1" class="ls-wp-container" style="width:100%;height:805px;margin:0 auto;margin-bottom: 0px;">
            <div class="ls-slide" data-ls="transition2d:1;timeshift:-1000;">
              <img :src="require('@/assets/web-site/upload/slide1.jpg')" class="ls-bg" alt="slide1">
              <p class="ls-l" style="top:254px;left:176px;font-weight: 700;height:40px;padding-right:10px;padding-left:10px;font-family:Lato, sans-serif;font-size:50px;color:#ffffff;border-radius:3px;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:1500;easingin:easeOutElastic;rotatexin:-90;transformoriginin:50% top 0;offsetxout:-200;durationout:1000;">
                CRAFT IS
              </p>
              <p class="ls-l" style="top:253px;left:420px;font-weight: 700;padding-top:0px;padding-right:10px;padding-bottom:0px;padding-left:10px;font-family:Lato, sans-serif;font-size:50px;color:#ffffff;background:#21b6a8;border-radius:3px;white-space: nowrap;" data-ls="durationin:2000;delayin:2000;rotatexin:-90;transformoriginin:50% top 0;durationout:1000;">
                READY
              </p>
              <p class="ls-l" style="top:254px;left:618px;font-weight: 700;font-family:Lato, sans-serif;font-size:50px;color:#ffffff;white-space: nowrap;" data-ls="delayin:2000;rotatexin:-90;transformoriginin:50% top 0;durationout:1000;">
                FOR YOUR BUSINESS
              </p>
              <p class="ls-l" style="top:401px;left:328px;text-align:center;font-family:Lato, sans-serif;;font-size:30px;color:#fff;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:3500;easingin:swing;transformoriginin:50% top 0;offsetxout:-400;">
                with our themes gain simplicity and powerfull
              </p>
              <p class="ls-l" style="top:453px;left:496px;font-family:Lato, sans-serif;;font-size:30px;color:#fff;white-space: nowrap;" data-ls="delayin:3700;easingin:swing;">
                business solutions
              </p>
              <img class="ls-l" style="top:352px;left:582px;white-space: nowrap;" data-ls="delayin:3000;easingin:swing;" :src="require('@/assets/web-site/upload/slider-title-sep.jpg')" alt="">
            </div>
            <div class="ls-slide" data-ls="transition2d:1;timeshift:-1000;">
              <img :src="require('@/assets/web-site/upload/slide2.jpg')" class="ls-bg" alt="slide2">
              <p class="ls-l" style="top:254px;left:176px;font-weight: 700;height:40px;padding-right:10px;padding-left:10px;font-family:Lato, sans-serif;font-size:50px;color:#ffffff;border-radius:3px;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:1500;easingin:easeOutElastic;rotatexin:-90;transformoriginin:50% top 0;offsetxout:-200;durationout:1000;">
                WE ARE CRAFT, WE CRAFT
              </p>
              <p class="ls-l" style="top:255px;left:878px;font-weight: 700;padding-top:0px;padding-right:10px;padding-bottom:0px;padding-left:10px;font-family:Lato, sans-serif;font-size:50px;color:#ffffff;background:#21b6a8;border-radius:3px;white-space: nowrap;" data-ls="durationin:2000;delayin:2000;rotatexin:-90;transformoriginin:50% top 0;durationout:1000;">
                BEAUTY
              </p>
              <p class="ls-l" style="top:399px;left:436px;font-weight:300;font-family:Lato, sans-serif;;font-size:30px;color:#fff;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:3500;easingin:swing;transformoriginin:50% top 0;offsetxout:-400;">
                beauty expressed in digital way
              </p>
              <p class="ls-l" style="top:452px;left:404px;font-weight:300;font-family:Lato, sans-serif;;font-size:30px;color:#fff;white-space: nowrap;" data-ls="delayin:3700;easingin:swing;">
                give you business a boost with <strong>craft</strong>
              </p>
              <img class="ls-l" style="top:360px;left:562px;white-space: nowrap;" data-ls="delayin:3000;easingin:swing;" :src="require('@/assets/web-site/upload/slider-title-sep.jpg')" alt="">
            </div>
            <div class="ls-slide" data-ls="transition2d:1;timeshift:-1000;">
              <img :src="require('@/assets/web-site/upload/slide3.jpg')" class="ls-bg" alt="slide3">
              <p class="ls-l" style="top:254px;left:58px;font-weight: 700;height:40px;padding-right:10px;padding-left:10px;font-family:Lato, sans-serif;font-size:50px;color:#ffffff;border-radius:3px;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:1200;easingin:easeOutElastic;rotatexin:-90;transformoriginin:50% top 0;offsetxout:-200;durationout:1000;">
                DEVICE FRIENDLY
              </p>
              <p class="ls-l" style="top:329px;left:106px;font-weight: 700;height:40px;padding-right:10px;padding-left:10px;font-family:Lato, sans-serif;font-size:50px;color:#ffffff;border-radius:3px;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:1500;easingin:easeOutElastic;rotatexin:-90;transformoriginin:50% top 0;offsetxout:-200;durationout:1000;">
                RESPONSIVE
              </p>
              <p class="ls-l" style="top:443px;left:44px;font-weight:300;font-family:Lato, sans-serif;;font-size:30px;color:#fff;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:3500;easingin:swing;transformoriginin:50% top 0;offsetxout:-400;">
                it doesn’t matter what device you have
              </p>
              <p class="ls-l" style="top:499px;left:75px;font-weight:300;font-family:Lato, sans-serif;;font-size:30px;color:#fff;white-space: nowrap;" data-ls="delayin:3700;easingin:swing;">
                craft fits perfectly on all of them
              </p>
              <img class="ls-l" style="top:409px;left:214px;white-space: nowrap;" data-ls="delayin:3000;easingin:swing;" :src="require('@/assets/web-site/upload/slider-title-sep.jpg')" alt=""><img class="ls-l" style="top:202px;left:598px;white-space: nowrap;" data-ls="delayin:4000;easingin:easeInQuint;rotatexin:20;transformoriginin:50% 0 top;" src="upload/imac.png" alt=""><img class="ls-l" style="top:409px;left:549px;white-space: nowrap;" data-ls="delayin:4200;rotatexin:30;transformoriginin:50% 0 left;" src="upload/ipad-air.png" alt=""><img class="ls-l" style="top:431px;left:1042px;white-space: nowrap;" data-ls="delayin:4450;rotatexin:40;transformoriginin:50% 0 right;" src="upload/iphone.png" alt="">
            </div>
          </div>
        </div>
      </div>
    </section>

    <!-- Start Main -->
    <section id="main">
      <div id="page">

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element waves-heading default center col-md-12">
                    <h3 class="heading-title">FEATURED PROJECTS OF <span>CRAFT</span> TEMPLATE<span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                    <p>
                      Crafting is our speciality, we craft beautifull web site and templates, your business with us will benefit in most better way, so why wait buy now and gain great web site from our team.
                    </p>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-3">
                    <div id="div_7fb0_2" class="tw-service-box top-service style_1">
                      <div id="div_7fb0_3" class="tw-service-icon">
                        <i id="i_7fb0_0" class="tw-font-icon fa fa-thumbs-o-up " />
                      </div>
                      <div class="tw-service-content ">
                        <h3>FANTASTIC DESIGN</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis. nostrud exercitation ullamco.
                        </p>
                        <div class="service-title-sep last" />
                        <a class="more" href="#" target="_blank">VIEW MORE...</a>
                      </div>
                    </div>
                  </div>
                  <div class="tw-element col-md-3">
                    <div id="div_7fb0_4" class="tw-service-box top-service style_1">
                      <div id="div_7fb0_5" class="tw-service-icon">
                        <i id="i_7fb0_1" class="tw-font-icon fa fa-tablet " />
                      </div>
                      <div class="tw-service-content ">
                        <h3>100% responsive</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis. nostrud exercitation ullamco.
                        </p>
                        <div class="service-title-sep last" />
                        <a class="more" href="#" target="_blank">VIEW MORE...</a>
                      </div>
                    </div>
                  </div>
                  <div class="tw-element col-md-3">
                    <div id="div_7fb0_6" class="tw-service-box top-service style_1">
                      <div id="div_7fb0_7" class="tw-service-icon">
                        <i id="i_7fb0_2" class="tw-font-icon fa fa-umbrella " />
                      </div>
                      <div class="tw-service-content ">
                        <h3>24h FREE SUPPORT</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis. nostrud exercitation ullamco.
                        </p>
                        <div class="service-title-sep last" />
                        <a class="more" href="#" target="_blank">VIEW MORE...</a>
                      </div>
                    </div>
                  </div>
                  <div class="tw-element col-md-3">
                    <div id="div_7fb0_8" class="tw-service-box top-service style_1">
                      <div id="div_7fb0_9" class="tw-service-icon">
                        <i id="i_7fb0_3" class="tw-font-icon fa fa-folder-open-o " />
                      </div>
                      <div class="tw-service-content ">
                        <h3>ORGANIZED FOLDERS</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis. nostrud exercitation ullamco.
                        </p>
                        <div class="service-title-sep last" />
                        <a class="more" href="#" target="_blank">VIEW MORE...</a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element waves-heading default center col-md-12">
                    <h3 class="heading-title">CHECK THE <span>PROJECTS</span> WHE WORKED ON<span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                    <p>
                      Crafting is our speciality, we craft beautifull web site and templates, your business with us will benefit in most better way, so why wait buy now and gain great web site from our team.
                    </p>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element waves-portfolio col5f waves-full-element col-md-12">
                    <div class="tw-filters">
                      <ul class="filters clearfix single" data-option-key="filter">
                        <li><a href="#filter" data-option-value="*" class="show-all selected">Show All</a></li>
                        <li class="hidden"><a href="#filter" data-option-value=".category-art" title="Art">Art</a></li>
                        <li class="hidden"><a href="#filter" data-option-value=".category-design" title="Design">Design</a></li>
                        <li class="hidden"><a href="#filter" data-option-value=".category-nature-2" title="Nature">Nature</a></li>
                        <li class="hidden"><a href="#filter" data-option-value=".category-visualisation" title="Visualisation">Visualisation</a></li>
                        <li class="hidden"><a href="#filter" data-option-value=".category-web-design" title="Web Design">Web Design</a></li>
                      </ul>
                    </div>
                    <div class="row">
                      <div class="isotope-container" data-column="5">
                        <article class="portfolio not-inited category-art category-visualisation">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio10.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio10.jpg" data-gal="prettyPhoto[52]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">Baby with shoes</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a>, <a href="#" rel="tag">Visualisation</a></span><span data-pid="52" class="likeit"><i class="fa fa-heart" /><span>10</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-nature-2">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio9.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio9.jpg" data-gal="prettyPhoto[51]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">Parrot</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Nature</a></span><span data-pid="51" class="likeit"><i class="fa fa-heart" /><span>12</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-art category-visualisation">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio8.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio8.jpg" data-gal="prettyPhoto[50]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">Mirror of Window</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a>, <a href="#" rel="tag">Visualisation</a></span><span data-pid="50" class="likeit"><i class="fa fa-heart" /><span>8</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-art category-nature-2">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio7.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio7.jpg" data-gal="prettyPhoto[49]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">Pigeon</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a>, <a href="#" rel="tag">Nature</a></span><span data-pid="49" class="likeit"><i class="fa fa-heart" /><span>5</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-art category-design">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio6.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href=""><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio6.jpg" data-gal="prettyPhoto[48]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="">Nature of Beauty</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a>, <a href="portfolio-single_category/design.html" rel="tag">Design</a></span><span data-pid="48" class="likeit"><i class="fa fa-heart" /><span>2</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-art category-design category-visualisation">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio5.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio5.jpg" data-gal="prettyPhoto[47]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">Happy Friends</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a>, <a href="portfolio-single_category/design.html" rel="tag">Design</a>, <a href="#" rel="tag">Visualisation</a></span><span data-pid="47" class="likeit"><i class="fa fa-heart" /><span>3</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-art category-nature-2 category-visualisation">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio4.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio4.jpg" data-gal="prettyPhoto[46]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">Nature</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a>, <a href="#" rel="tag">Nature</a>, <a href="#" rel="tag">Visualisation</a></span><span data-pid="46" class="likeit"><i class="fa fa-heart" /><span>3</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-art">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio.jpg" data-gal="prettyPhoto[43]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">Black and White Baby</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a></span><span data-pid="43" class="likeit"><i class="fa fa-heart" /><span>7</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-art category-visualisation">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio3.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio3.jpg" data-gal="prettyPhoto[45]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">House Design</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a>, <a href="#" rel="tag">Visualisation</a></span><span data-pid="45" class="likeit"><i class="fa fa-heart" /><span>0</span></span>
                            </div>
                          </div>
                        </article>

                        <article class="portfolio not-inited category-art">
                          <div class="portfolio-thumb">
                            <img alt="" src="upload/portfolio2.jpg">
                            <div class="image-overlay" />
                            <div class="portfolio-hover">
                              <div class="meta-link">
                                <a class="to-link" href="#"><i class="fa fa-chain" /></a><a class="to-image" href="upload/portfolio2.jpg" data-gal="prettyPhoto[44]"><i class="fa fa-expand" /></a>
                              </div>
                              <h2 class="portfolio-title"><a href="#">Cat and Baby</a></h2>
                              <span class="portfolio-meta"><a href="#" rel="tag">Art</a></span><span data-pid="44" class="likeit"><i class="fa fa-heart" /><span>0</span></span>
                            </div>
                          </div>
                        </article>
                      </div>
                    </div>
                    <div class="tw-pagination tw-infinite-scroll align-center">
                      <a class="next" href="#">VIEW MORE...</a>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- end portofolio -->

        <div id="div_0e1d_0" class="row-container light bg-parallax">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-7 ">
                <div class="row">
                  <div class="tw-element waves-heading without_seperator left col-md-12">
                    <h3 class="heading-title">POWERFULL <span>TEMPLATE</span> FOR POWERFULL PEOPLE</h3>
                    <p>
                      Crafting is our speciality, we craft beautifull web site and templates, your business with us will benefit in most better way, so why wait buy now and gain great web site from our team.
                    </p>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-6 no-bottom">
                    <ul class="waves-list">
                      <li class=""><i class="fa fa-check" />Bootstrap 3.0 Responsive</li>
                      <li class=""><i class="fa fa-check" />Perfect Design</li>
                      <li class=""><i class="fa fa-check" />Very easy to Costumize</li>
                      <li class=""><i class="fa fa-check" />Retina Ready</li>
                    </ul>
                  </div>
                  <div class="tw-element col-md-6 no-bottom">
                    <ul class="waves-list">
                      <li class=""><i class="fa fa-check" />HTML5 &amp; CSS3 Powered</li>
                      <li class=""><i class="fa fa-check" />FontAwesome Icons</li>
                      <li class=""><i class="fa fa-check" />Beautiful Typography</li>
                      <li class=""><i class="fa fa-check" />Great Slider</li>
                    </ul>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-12 no-top">
                    <a id="a_0e1d_0" href="#" target="_blank" class="btn btn-border btn-medium">BYE NOW<span id="span_0e1d_0" /></a>
                  </div>
                </div>
              </div>
              <div class="col-md-5 ">
                <div class="row">
                  <div id="div_0e1d_1" class="tw-element divider-center tw-divider-space col-md-12">
                    <div style="" />
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-12 no-bottom">
                    <p>
                      <img class="size-full wp-image-480 alignright" src="upload/home1-ipad-iphone.png" alt="home1-ipad-iphone" width="442" height="510">
                    </p>
                  </div>
                </div>
              </div>
            </div>
            <div id="div_0e1d_2" />
          </div>
        </div>

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element waves-heading default center col-md-12">
                    <h3 class="heading-title">BRAVE <span>KNIGHTS</span> OF OUR CREW<span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                    <p>
                      We are a special team, a lot of members but with big potential to work for the best of our customers. Our knights can really show fantastic ideas and work.
                    </p>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element waves-team col-md-3">
                    <div class="member-image overlay-container">
                      <img src="upload/Team-51.jpg" alt="Roy Cute">
                      <div class="image-overlay">
                        <div class="portfolio-overlay-icon">
                          <div class="member-social">
                            <div class="tw-social-icon clearfix">
                              <a href="#" target="_blank" class="facebook"><i class="fa fa-facebook" /></a><a href="#" target="_blank" class="gplus"><i class="fa fa-google-plus" /></a>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="member-title">
                      <h2>Roy Cute</h2>
                      <div class="member-pos">
                        ceo at craft
                      </div>
                      <span class="title-sep" />
                    </div>
                    <div class="team-content">
                      <p>
                        Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore.
                      </p>
                    </div>
                  </div>
                  <div class="tw-element waves-team col-md-3">
                    <div class="member-image overlay-container">
                      <img src="upload/Team-81.jpg" alt="hansom rob">
                      <div class="image-overlay">
                        <div class="portfolio-overlay-icon">
                          <div class="member-social">
                            <div class="tw-social-icon clearfix">
                              <a href="#" target="_blank" class="facebook"><i class="fa fa-facebook" /></a><a href="#" target="_blank" class="gplus"><i class="fa fa-google-plus" /></a>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="member-title">
                      <h2>hansom rob</h2>
                      <div class="member-pos">
                        web developer
                      </div>
                      <span class="title-sep" />
                    </div>
                    <div class="team-content">
                      <p>
                        Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore.
                      </p>
                    </div>
                  </div>
                  <div class="tw-element waves-team col-md-3">
                    <div class="member-image overlay-container">
                      <img src="upload/Team-61.jpg" alt="john wayne">
                      <div class="image-overlay">
                        <div class="portfolio-overlay-icon">
                          <div class="member-social">
                            <div class="tw-social-icon clearfix">
                              <a href="#" target="_blank" class="facebook"><i class="fa fa-facebook" /></a><a href="#" target="_blank" class="gplus"><i class="fa fa-google-plus" /></a>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="member-title">
                      <h2>john wayne</h2>
                      <div class="member-pos">
                        cowboy
                      </div>
                      <span class="title-sep" />
                    </div>
                    <div class="team-content">
                      <p>
                        Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore.
                      </p>
                    </div>
                  </div>
                  <div class="tw-element waves-team col-md-3">
                    <div class="member-image overlay-container">
                      <img src="upload/Team-41.jpg" alt="james domb">
                      <div class="image-overlay">
                        <div class="portfolio-overlay-icon">
                          <div class="member-social">
                            <div class="tw-social-icon clearfix">
                              <a href="#" target="_blank" class="facebook"><i class="fa fa-facebook" /></a><a href="#" target="_blank" class="gplus"><i class="fa fa-google-plus" /></a>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="member-title">
                      <h2>james domb</h2>
                      <div class="member-pos">
                        secret agent
                      </div>
                      <span class="title-sep" />
                    </div>
                    <div class="team-content">
                      <p>
                        Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore.
                      </p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- End Team -->

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element waves-heading default center col-md-12">
                    <h3 class="heading-title">ABOUT <span>OUR</span> COMPANY<span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                    <p>
                      Crafting is our speciality, we craft beautifull web site and templates, your business with us will benefit in most better way, so why wait buy now and gain great web site from our team.
                    </p>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element waves-about col-md-12">
                    <div class="about-group about-type-title">
                      <div class="about-title">
                        2014
                      </div>
                    </div>
                    <div class="about-group about-type-content clearfix about-pos-left">
                      <div class="about-bullet" />
                      <div class="about-content">
                        <div class="about-heading clearfix">
                          <div class="about-title">
                            Lorem Ipsum history
                          </div>
                          <div class="about-date">
                            02/01/2014
                          </div>
                        </div>
                        <div class="about-body">
                          <div class="about-inner">
                            <p>
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do usmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam, quis nostrud exercitation ullamco.
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="about-group about-type-content clearfix about-pos-right">
                      <div class="about-bullet" />
                      <div class="about-content">
                        <div class="about-heading clearfix">
                          <div class="about-title">
                            Lorem Ipsum history
                          </div>
                          <div class="about-date">
                            02/01/2014
                          </div>
                        </div>
                        <div class="about-body">
                          <div class="about-inner">
                            <p>
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do usmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam, quis nostrud exercitation ullamco.
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="about-group about-type-content clearfix about-pos-left">
                      <div class="about-bullet" />
                      <div class="about-content">
                        <div class="about-heading clearfix">
                          <div class="about-title">
                            Lorem Ipsum history
                          </div>
                          <div class="about-date">
                            02/01/2014
                          </div>
                        </div>
                        <div class="about-body">
                          <div class="about-inner">
                            <p>
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do usmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam, quis nostrud exercitation ullamco.
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="about-group about-type-content clearfix about-pos-right">
                      <div class="about-bullet" />
                      <div class="about-content">
                        <div class="about-heading clearfix">
                          <div class="about-title">
                            Lorem Ipsum history
                          </div>
                          <div class="about-date">
                            02/01/2014
                          </div>
                        </div>
                        <div class="about-body">
                          <div class="about-inner">
                            <p>
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do usmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam, quis nostrud exercitation ullamco.
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="about-group about-type-content clearfix about-pos-left">
                      <div class="about-bullet" />
                      <div class="about-content">
                        <div class="about-heading clearfix">
                          <div class="about-title">
                            Lorem Ipsum history
                          </div>
                          <div class="about-date">
                            02/01/2014
                          </div>
                        </div>
                        <div class="about-body">
                          <div class="about-inner">
                            <p>
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do usmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam, quis nostrud exercitation ullamco.
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="about-group about-type-title">
                      <div class="about-title">
                        2013
                      </div>
                    </div>
                    <div class="about-group about-type-content clearfix about-pos-right">
                      <div class="about-bullet" />
                      <div class="about-content">
                        <div class="about-heading clearfix">
                          <div class="about-title">
                            Lorem Ipsum history
                          </div>
                          <div class="about-date">
                            02/01/2013
                          </div>
                        </div>
                        <div class="about-body">
                          <div class="about-inner">
                            <p>
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do usmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam, quis nostrud exercitation ullamco.
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="about-group about-type-content clearfix about-pos-left">
                      <div class="about-bullet" />
                      <div class="about-content">
                        <div class="about-heading clearfix">
                          <div class="about-title">
                            Lorem Ipsum history
                          </div>
                          <div class="about-date">
                            02/01/2013
                          </div>
                        </div>
                        <div class="about-body">
                          <div class="about-inner">
                            <p>
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do usmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam, quis nostrud exercitation ullamco.
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="about-group about-type-content clearfix about-pos-right">
                      <div class="about-bullet" />
                      <div class="about-content">
                        <div class="about-heading clearfix">
                          <div class="about-title">
                            Lorem Ipsum history
                          </div>
                          <div class="about-date">
                            02/01/2013
                          </div>
                        </div>
                        <div class="about-body">
                          <div class="about-inner">
                            <p>
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do usmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam, quis nostrud exercitation ullamco.
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="about-group about-type-title">
                      <div class="about-title">
                        Start
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div id="div_0e1d_3" class="row-container dark bg-scroll">
          <div class="video-mask" />
          <div class="video-mask-color" />
          <div class="background-video">
            <div id="jquery_jplayer_77" class="jp-jplayer jp-jplayer-bgvideo" data-pid="77" data-m4v="upload/BlackInk.mp4" data-thumb="upload/bg-for-video.jpg" />
          </div>
          <div id="div_0e1d_4" class="waves-container container">
            <div class="row">
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element col-md-12">
                    <div class="bg-video-container bg-video-vertical">
                      <h2 class="bg-video-first-text">CHECK OUR VIDEO BACKGROUND</h2>
                      <i class="bg-video-play tw-font-icon fa fa-play" />
                      <h2 class="bg-video-last-text">GOOD FOR ANY PRESENTATION</h2>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- End Video -->

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element waves-heading default center col-md-12">
                    <h3 class="heading-title">MAIN <span>SERVICES</span><span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                    <p>
                      We are a special team, a lot of members but with big potential to work for the best of our customers. Our knights can really show fantastic ideas and work.
                    </p>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-4">
                    <div id="div_8b27_0" class="tw-service-box top-service style_2">
                      <div id="div_8b27_1" class="tw-service-icon">
                        <i id="i_8b27_0" class="tw-font-icon fa icon-film " />
                      </div>
                      <div class="tw-service-content ">
                        <h3>Images / Photography</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis. nostrud exercitation ullamco.
                        </p>
                      </div>
                    </div>
                  </div>
                  <div class="tw-element col-md-4">
                    <div id="div_8b27_2" class="tw-service-box top-service style_2">
                      <div id="div_8b27_3" class="tw-service-icon">
                        <i id="i_8b27_1" class="tw-font-icon fa icon-calculator " />
                      </div>
                      <div class="tw-service-content ">
                        <h3>Analytics</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis. nostrud exercitation ullamco.
                        </p>
                      </div>
                    </div>
                  </div>
                  <div class="tw-element col-md-4">
                    <div id="div_8b27_4" class="tw-service-box top-service style_2">
                      <div id="div_8b27_5" class="tw-service-icon">
                        <i id="i_8b27_2" class="tw-font-icon fa icon-vector " />
                      </div>
                      <div class="tw-service-content ">
                        <h3>Consulting</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis. nostrud exercitation ullamco.
                        </p>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div id="div_8b27_6" />
          </div>
        </div>

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-6 ">
                <div class="row">
                  <div class="tw-element waves-heading default left col-md-12 no-bottom">
                    <h3 class="heading-title">Testimonials<span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-12">
                    <div class="waves-testimonials">
                      <div class="testimonial-item clearfix style-default">
                        <div class="testimonial-content">
                          <div class="testimonial-content-inner">
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
                          </div>
                        </div>
                        <div class="testimonial-footer clearfix">
                          <div class="testimonial-thumb">
                            <img src="upload/Team-81.jpg" alt="">
                          </div>
                          <div class="testimonial-author">
                            <h2><a href="#">Hansom Rob</a></h2>
                            <span>ceo at the chocolate factory</span>
                          </div>
                          <div class="testimonial-meta">
                            <a href="#">themeforest.com</a><span><i class="tw-font-icon fa fa-star" /><i class="tw-font-icon fa fa-star" /><i class="tw-font-icon fa fa-star" /><i class="tw-font-icon fa fa-star" /><i class="tw-font-icon fa fa-star-o" /></span>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-md-6 ">
                <div class="row">
                  <div class="tw-element waves-heading default left col-md-12 no-bottom">
                    <h3 class="heading-title">Accordions<span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element waves-accordion col-md-12">
                    <div class="accordion-group active">
                      <div class="accordion-heading">
                        <a class="accordion-toggle" data-toggle="collapse" data-parent="" href="#">Responsive 100%</a>
                      </div>
                      <div class="accordion-body collapse">
                        <div class="accordion-inner">
                          <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
                          </p>
                        </div>
                      </div>
                    </div>
                    <div class="accordion-group">
                      <div class="accordion-heading">
                        <a class="accordion-toggle" data-toggle="collapse" data-parent="" href="#">Parallax Ready</a>
                      </div>
                      <div class="accordion-body collapse">
                        <div class="accordion-inner">
                          <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
                          </p>
                        </div>
                      </div>
                    </div>
                    <div class="accordion-group">
                      <div class="accordion-heading">
                        <a class="accordion-toggle" data-toggle="collapse" data-parent="" href="#">Video Background Ready</a>
                      </div>
                      <div class="accordion-body collapse">
                        <div class="accordion-inner">
                          <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
                          </p>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div id="div_8b27_7" class="row-container light bg-parallax">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-6 ">
                <div class="row">
                  <div class="tw-element col-md-12">
                    <h2 id="h2_8b27_0">Craft is for making things better, whenever you look at it you fall in love with it, so try it and be happy :).</h2>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-12">
                    <div id="div_8b27_8" class="tw-service-box left-service style_1">
                      <div id="div_8b27_9" class="tw-service-icon">
                        <i id="i_8b27_3" class="tw-font-icon fa fa-star " />
                      </div>
                      <div id="div_8b27_10" class="tw-service-content desc_unstyle">
                        <h3>MADE ULTRA RESPONSIVE</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore.
                        </p>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-12">
                    <div id="div_8b27_11" class="tw-service-box left-service style_1">
                      <div id="div_8b27_12" class="tw-service-icon">
                        <i id="i_8b27_4" class="tw-font-icon fa fa-star-o " />
                      </div>
                      <div id="div_8b27_13" class="tw-service-content desc_unstyle">
                        <h3>FANTASTIC AND ELEGANT DESIGN</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore.
                        </p>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-12">
                    <div id="div_8b27_14" class="tw-service-box left-service style_1">
                      <div id="div_8b27_15" class="tw-service-icon">
                        <i id="i_8b27_5" class="tw-font-icon fa fa-star-o " />
                      </div>
                      <div id="div_8b27_16" class="tw-service-content desc_unstyle">
                        <h3>FANTASTIC AND ELEGANT DESIGN</h3>
                        <div class="service-title-sep" />
                        <p>
                          Lorem ipsum dolor sit amet, isectetur adipisicing elit, sed do eiusmod empor incididunt ut labore et dolore.
                        </p>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-md-6 ">
                <div class="row">
                  <div id="div_8b27_17" class="tw-element divider-center tw-divider-space col-md-12">
                    <div style="" />
                  </div>
                </div>
                <div class="row">
                  <div id="div_8b27_18" class="tw-element col-md-12 no-bottom tw-animate-gen" data-animation="fadeInRightBig" data-animation-delay="500" data-animation-offset="90%">
                    <p>
                      <img class="alignnone size-full wp-image-389" src="upload/ipad-naluu.png" alt="ipad-naluu" width="648" height="617">
                    </p>
                  </div>
                </div>
              </div>
            </div>
            <div id="div_8b27_19" />
          </div>
        </div>

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element waves-heading default center col-md-12">
                    <h3 class="heading-title">PRICING <span>TABLES</span><span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                    <p>
                      We are a special team, a lot of members but with big potential to work for the best of our customers. Our knights can really show fantastic ideas and work.
                    </p>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element waves-pricing clearfix col-md-12">
                    <div class="pricing-column featured tw-animate-gen tw-pricing-four">
                      <header class="pricing-header">
                        <h1>REGULAR</h1>
                      </header>
                      <div class="pricing-box">
                        <div class="pricing-top">
                          <div class="price-symbol">
                            $60
                          </div>
                          <div class="price-time">
                            per month
                          </div>
                        </div>
                        <div class="pricing-content">
                          <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                          </p>
                          <ul>
                            <li>15GB Disk Space</li>
                            <li>100GB Monthly Bandwidth</li>
                            <li>25 Email Accounts</li>
                            <li>Unlimited subdomains</li>
                          </ul>
                        </div>
                        <footer class="pricing-footer"><a href="" class="btn btn-border btn-medium">Buy now</a></footer>
                      </div>
                    </div>
                    <div class="pricing-column tw-animate-gen tw-pricing-four">
                      <header class="pricing-header">
                        <h1>PREMIUM</h1>
                      </header>
                      <div class="pricing-box">
                        <div class="pricing-top">
                          <div class="price-symbol">
                            $45
                          </div>
                          <div class="price-time">
                            per month
                          </div>
                        </div>
                        <div class="pricing-content">
                          <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                          </p>
                          <ul>
                            <li>15GB Disk Space</li>
                            <li>100GB Monthly Bandwidth</li>
                            <li>25 Email Accounts</li>
                            <li>Unlimited subdomains</li>
                          </ul>
                        </div>
                        <footer class="pricing-footer"><a href="" class="btn btn-border btn-medium">Buy now</a></footer>
                      </div>
                    </div>
                    <div class="pricing-column tw-animate-gen tw-pricing-four">
                      <header class="pricing-header">
                        <h1>PLUS</h1>
                      </header>
                      <div class="pricing-box">
                        <div class="pricing-top">
                          <div class="price-symbol">
                            $75
                          </div>
                          <div class="price-time">
                            per month
                          </div>
                        </div>
                        <div class="pricing-content">
                          <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                          </p>
                          <ul>
                            <li>15GB Disk Space</li>
                            <li>100GB Monthly Bandwidth</li>
                            <li>25 Email Accounts</li>
                            <li>Unlimited subdomains</li>
                          </ul>
                        </div>
                        <footer class="pricing-footer"><a href="" class="btn btn-border btn-medium">Buy now</a></footer>
                      </div>
                    </div>
                    <div class="pricing-column tw-animate-gen tw-pricing-four">
                      <header class="pricing-header">
                        <h1>ENTERPRISE</h1>
                      </header>
                      <div class="pricing-box">
                        <div class="pricing-top">
                          <div class="price-symbol">
                            $90
                          </div>
                          <div class="price-time">
                            per month
                          </div>
                        </div>
                        <div class="pricing-content">
                          <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                          </p>
                          <ul>
                            <li>15GB Disk Space</li>
                            <li>100GB Monthly Bandwidth</li>
                            <li>25 Email Accounts</li>
                            <li>Unlimited subdomains</li>
                          </ul>
                        </div>
                        <footer class="pricing-footer"><a href="" class="btn btn-border btn-medium">Buy now</a></footer>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div id="div_35df_0" />
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element col-md-12">
                    <div class="waves-map waves-full-element">
                      <!---<iframe id="iframe_35df_0" height="500" src="https://maps.google.com/maps/ms?ie=UTF8&amp;t=m&amp;oe=UTF8&amp;msa=0&amp;msid=214016756066899835659.0004a82fbb4875ff989ac&amp;ll=-37.812607,144.968666&amp;spn=0.002967,0.001073&amp;z=17&amp;output=embed">
										</iframe>--->
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div id="div_35df_1" />
          </div>
        </div>

        <div class="row-container light bg-scroll">
          <div class="waves-container container">
            <div class="row">
              <div class="col-md-12 ">
                <div class="row">
                  <div class="tw-element waves-heading default center col-md-12">
                    <h3 class="heading-title">Contact <span>Form</span><span class="title-seperator"><i class="default"><span /><span /></i></span></h3>
                    <p>
                      What to speak directly to us, we are here and waiting for you to tell us what you thing of this theme. So don?t hesitate and contact us and rate our template.
                    </p>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element col-md-12">
                    <div id="wpcf7-f334-p77-o1" role="form" class="wpcf7" lang="en-US" dir="ltr">
                      <div class="screen-reader-response" />
                      <form id="contact-form">
                        <span class="wpcf7-form-control-wrap your-name">
                          <input id="name" type="text" name="name" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" placeholder="Your name here">
                        </span>
                        <span class="wpcf7-form-control-wrap your-email">
                          <input type="text" name="mail" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" aria-required="true" aria-invalid="false" placeholder="Email"></span>
                        <span class="wpcf7-form-control-wrap your-subject">
                          <input type="text" name="website" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" placeholder="Subject"></span>
                        <p>
                          <span class="wpcf7-form-control-wrap your-message">
                            <textarea id="comment" name="comment" cols="40" rows="10" class="wpcf7-form-control wpcf7-textarea" aria-invalid="false" placeholder="Write your message here" /></span>
                        </p>
                        <p>
                          <input id="submit_contact" type="submit" value="Send message" class="wpcf7-form-control wpcf7-submit">
                        </p><div id="msg" class="message" />
                        <p />

                      </form>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="tw-element waves-callout with-button col-md-12">
                    <div class="callout-container">
                      <div class="callout-text">
                        <p>
                          <b>CRAFT</b> is all about business and gaining great opportunities so dont hesitate
                        </p>
                        <a href="#" target="_blank" class="btn btn-callout">Buy now</a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    <!-- End Main -->

    <div id="bottom">
      <!-- Start Container-->
      <div class="container">
        <div class="row">
          <div class="col-md-3 col-1">
            <aside id="text-4" class="widget widget_text">
              <div class="textwidget">
                <img :src="require('@/assets/web-site/upload/footer-logo.png')" alt="">
                <br>
                <br>
                Lorem ipsum dolor sit amet, insectetur adipisicing. <a href="#" title="Read More">READ MORE</a>
                <br>
                <br>
                Address: 321 Name Street, City, State<br>
                Phone: 0 800 55 555 55 123<br>
                e-mail: info@craftemplate.com
              </div>
            </aside>
          </div>
          <div class="col-md-3 col-2">
            <aside id="twrecentportwidget-2" class="widget TWRecentPortWidget">
              <div class="tw-widget-title-container">
                <h3 class="widget-title">Recent Works</h3>
              </div>
              <div class="tw-recent-portfolios-widget clearfix">
                <a href="#"><img src="upload/portfolio10-150x150.jpg" alt="Baby with shoes"></a>
                <a href="#"><img src="upload/portfolio9-150x150.jpg" alt="Parrot"></a>
                <a href="#"><img src="upload/portfolio8-150x150.jpg" alt="Mirror of Window"></a>
                <a href="#"><img src="upload/portfolio7-150x150.jpg" alt="Pigeon"></a>
                <a href="#"><img src="upload/portfolio6-150x150.jpg" alt="Nature of Beauty"></a>
                <a href="#"><img src="upload/portfolio5-150x150.jpg" alt="Happy Friends"></a>
              </div>
            </aside>
          </div>
          <div class="col-md-3 col-3">
            <aside id="recent-posts-3" class="widget widget_recent_entries">
              <div class="tw-widget-title-container">
                <h3 class="widget-title">Recent Posts</h3>
              </div>
              <ul>
                <li>
                  <a href="#">Night Car</a>
                </li>
                <li>
                  <a href="#">Gate of Faith</a>
                </li>
                <li>
                  <a href="#">Mix Sound Cloud</a>
                </li>
                <li>
                  <a href="#">Cute old BIG Bear watching us</a>
                </li>
                <li>
                  <a href="#">Format Video</a>
                </li>
              </ul>
            </aside>
          </div>
          <div class="col-md-3 col-4">
            <aside id="tag_cloud-2" class="widget widget_tag_cloud">
              <div class="tw-widget-title-container">
                <h3 class="widget-title">Tags</h3>
              </div>
              <div class="tagcloud">
                <a href="#" class="tag-link-30" title="2 topics" style="font-size: 14px;">audio</a>
                <a href="#" class="tag-link-17" title="1 topic" style="font-size: 14px;">bear</a>
                <a href="#" class="tag-link-21" title="1 topic" style="font-size: 14px;">design</a>
                <a href="#" class="tag-link-26" title="2 topics" style="font-size: 14px;">gallery</a>
                <a href="#" class="tag-link-25" title="2 topics" style="font-size: 14px;">image</a>
                <a href="#" class="tag-link-18" title="1 topic" style="font-size: 14px;">nature</a>
                <a href="#" class="tag-link-16" title="1 topic" style="font-size: 14px;">photography</a>
                <a href="#" class="tag-link-24" title="4 topics" style="font-size: 14px;">premium theme</a>
              </div>
            </aside>
          </div>
        </div>
      </div>
      <!-- End Container -->
    </div>

    <footer id="footer">
      <!-- Start Container -->
      <div class="container">
        <div class="row">
          <div class="col-md-8">
            <p class="copyright">
              Copyright &copy; 2017.Company name All rights reserved.<a target="_blank" href="http://guantaow.taobao.com/">厚朴网络淘宝店</a><a target="_blank" href="http://www.moobnn.com">网页模板</a>
            </p>
          </div>
          <div class="col-md-4">
            <div class="tw-social-icon" />
          </div>
        </div>
      </div>
      <!-- End Container -->
    </footer>

    <a id="scrollUp" title="Scroll to top"><i class="fa fa-chevron-up" /></a>
  </div>
</template>

<script>
export default {
  name: 'Mainpage'
}
</script>
	<!--<link rel="stylesheet" href="css/animate.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/default.css">
	<link rel="stylesheet" href="css/font-awesome.min.css">
	<link rel="stylesheet" href="css/jquery-ui-custom.css">
	<link rel="stylesheet" href="css/mmenu.css">
	<link rel="stylesheet" href="css/placebo.css">
	<link rel="stylesheet" href="css/prettyPhoto.css">
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/responsive.css">
	<link rel="stylesheet" href="layerslider/css/layerslider.css">
	<link rel="stylesheet" href="css/twentytwenty.css">
	<link rel="stylesheet" href="css/test.css">@import "../../assets/web-site/css/font-awesome.min.css";@import "../../assets/web-site/css/jquery-ui-custom.css";
@import "../../assets/web-site/css/prettyPhoto.css";-->
<style scoped>
@import "../../assets/web-site/css/animate.css";
@import "../../assets/web-site/css/bootstrap.min.css";
@import "../../assets/web-site/css/default.css";

@import "../../assets/web-site/css/mmenu.css";
@import "../../assets/web-site/css/placebo.css";

@import "../../assets/web-site/css/style.css";
@import "../../assets/web-site/css/responsive.css";
@import "../../assets/web-site/css/twentytwenty.css";
@import "../../assets/web-site/css/test.css";
</style>
